<!-- BEGIN LOGO -->
<div class="logo">
    <a href="index.html">
        <img src="<?=static_url('img/logo-big.png')?>" alt=""/>
    </a>
</div>
<!-- END LOGO -->

<!-- BEGIN LOGIN -->
<div class="content">
    <!-- BEGIN LOGIN FORM -->
    <form class="login-form" action="<?=url('user/login')?>" method="post">
        <h3 class="form-title"><?=__('Login to your account')?></h3>
        <div class="alert alert-danger display-hide">
            <button class="close" data-close="alert"></button>
            <span class="message"></span>
        </div>
        <div class="form-group">
            <!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
            <label class="control-label visible-ie8 visible-ie9">Email</label>
            <div class="input-icon">
                <i class="fa fa-user"></i>
                <input class="form-control placeholder-no-fix"
                    type="text" autocomplete="off" placeholder="Email" name="username"
                    data-required="<?=__('Email is required.')?>" />
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9"><?=__('Password')?></label>
            <div class="input-icon">
                <i class="fa fa-lock"></i>
                <input class="form-control placeholder-no-fix"
                    type="password" autocomplete="off" placeholder="<?=__('Password')?>" name="password"
                    data-required="<?=__('Password is required.')?>" />
            </div>
        </div>
        <div class="form-actions">
            <label class="checkbox">
            <input type="checkbox" name="remember" value="1" checked="checked" /><?=__('Remember me')?></label>
            <button type="submit" class="btn green pull-right">
                <?=__('Login')?>
                <i class="m-icon-swapright m-icon-white"></i>
            </button>
        </div>
        <div class="forget-password">
            <h4><?=__('Forgot your password ?')?></h4>
            <p>
                <?=__('no worries, click #here to reset your password.',
                    array('#here' => '<a href="javascript:;" id="forget-password">' . __('here') . '</a>'))?>
            </p>
        </div>
        <!--div class="create-account">
            <p>
                 <?=__('Don\'t have an account yet ?')?>&nbsp;
                <a href="javascript:;" id="register-btn">
                     <?=__('Create an account')?>
                </a>
            </p>
        </div-->
    </form>
    <!-- END LOGIN FORM -->
    <!-- BEGIN FORGOT PASSWORD FORM -->
    <form class="forget-form" action="<?=url('user/forget')?>" method="post">
        <h3><?=__('Forget Password ?')?></h3>
        <p>
             <?=__('Enter your e-mail address below to reset your password.')?>
        </p>
        <div id="forget-alert"></div>
        <div class="form-group">
            <div class="input-icon">
                <i class="fa fa-envelope"></i>
                <input class="form-control placeholder-no-fix"
                    type="text" autocomplete="off" placeholder="<?=__('Email')?>" name="email"
                    data-required="<?=__('Email is required.')?>" data-email="<?=__('Invalid e-mail address.')?>" />
            </div>
        </div>
        <div class="form-actions">
            <button type="button" id="back-btn" class="btn">
            <i class="m-icon-swapleft"></i> <?=__('Back')?> </button>
            <button type="submit" class="btn green pull-right">
            <?=__('Submit')?> <i class="m-icon-swapright m-icon-white"></i>
            </button>
        </div>
    </form>
    <!-- END FORGOT PASSWORD FORM -->
    <!-- BEGIN REGISTRATION FORM -->
    <form class="register-form" action="<?=url('user/create')?>" method="post">
        <h3>Sign Up</h3>
        <p>
             Enter your personal details below:
        </p>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">Full Name</label>
            <div class="input-icon">
                <i class="fa fa-font"></i>
                <input class="form-control placeholder-no-fix" type="text" placeholder="Full Name" name="fullname"/>
            </div>
        </div>
        <div class="form-group">
            <!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
            <label class="control-label visible-ie8 visible-ie9">Email</label>
            <div class="input-icon">
                <i class="fa fa-envelope"></i>
                <input class="form-control placeholder-no-fix" type="text" placeholder="Email" name="email"/>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">Address</label>
            <div class="input-icon">
                <i class="fa fa-check"></i>
                <input class="form-control placeholder-no-fix" type="text" placeholder="Address" name="address"/>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">City/Town</label>
            <div class="input-icon">
                <i class="fa fa-location-arrow"></i>
                <input class="form-control placeholder-no-fix" type="text" placeholder="City/Town" name="city"/>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">Country</label>
            <select name="country" id="select2_sample4" class="select2 form-control">
                <option value=""></option>
                <option value="CN">China</option>
                <option value="NZ">New Zealand</option>
            </select>
        </div>
        <p>
             Enter your account details below:
        </p>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">Username</label>
            <div class="input-icon">
                <i class="fa fa-user"></i>
                <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="Username" name="username"/>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">Password</label>
            <div class="input-icon">
                <i class="fa fa-lock"></i>
                <input class="form-control placeholder-no-fix" type="password" autocomplete="off" id="register_password" placeholder="Password" name="password"/>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">Re-type Your Password</label>
            <div class="controls">
                <div class="input-icon">
                    <i class="fa fa-check"></i>
                    <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="Re-type Your Password" name="rpassword"/>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label>
            <input type="checkbox" name="tnc"/> I agree to the
            <a href="#">Terms of Service</a>
             and
            <a href="#">Privacy Policy</a>
            </label>
            <div id="register_tnc_error">
            </div>
        </div>
        <div class="form-actions">
            <button id="register-back-btn" type="button" class="btn">
            <i class="m-icon-swapleft"></i> Back </button>
            <button type="submit" id="register-submit-btn" class="btn green pull-right">
            Sign Up <i class="m-icon-swapright m-icon-white"></i>
            </button>
        </div>
    </form>
    <!-- END REGISTRATION FORM -->
</div>
<!-- END LOGIN -->

<!-- BEGIN COPYRIGHT -->
<div class="copyright">
     Copyright &copy; <?=date('Y')?> Formax Group Limited.
</div>
<!-- END COPYRIGHT -->

<div class="language">
    <? foreach ($langs as $l => $t): ?>
        <a href="<?=url_param(null, array('lang' => $l))?>">
            <img src="<?=static_url('img/flags/' . $l . '.png')?>"/>
            <span class="username"><?=$t?></span>
        </a>
        <?=on(end($langs) !== $t, '<span class="divider">|</span>')?>
    <? endforeach; ?>
</div>
